<!--
 * @Author: your name
 * @Date: 2020-11-26 11:07:46
 * @LastEditTime: 2020-12-10 11:46:10
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \solax-design\src\views\projectList\inverterData\inverterDetail.vue
-->
<template>
    <div class="moduleDetail-main-box">
        <el-dialog
        title="光伏模块信息"
        :visible="visibleShow"
        class="dialog-lg"
        width="1000px"
        :before-close="handleClose">
        
        <div>
           <el-form ref="form" :model="detailData" label-width="200px" label-position='left'>
            <el-row :gutter="24">
                <el-col :span="10" :offset="1">
                    <el-form-item label="制造商" prop="manufacturerID">
                        <template v-for="(item) in manufacturerList">
                            <span v-if="item.manufacturerID==detailData.manufacturerID" :key="item.manufacturerID">{{item.name}}</span>
                        </template>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row :gutter="24">
                <el-col :span="10" :offset="1">
                    <el-form-item label="光伏模块" prop="name">
                        {{detailData.name}}
                    </el-form-item>
                    <el-divider content-position="center">电子性能</el-divider>
                    <el-form-item label="额定功率" prop="pModMPP">
                        {{detailData.pModMPP}}Wp
                    </el-form-item>
                    <el-form-item label="性能容差" prop="tolerancePModMPP">
                        {{detailData.tolerancePModMPP}}%
                    </el-form-item>
                    <el-form-item label="MPP-电压" prop="uModMPP">
                        {{detailData.uModMPP}}V
                    </el-form-item>
                    <el-form-item label="MPP-电流" prop="iModMPP">
                        {{detailData.iModMPP}}V
                    </el-form-item>
                    <el-form-item label="开路电压" prop="uMod0">
                        {{detailData.uMod0}}V
                    </el-form-item>
                    <el-form-item label="短路电流" prop="iModSC">
                        {{detailData.iModSC}}A
                    </el-form-item>
                    <el-form-item label="允许的系统电压" prop="uModMax">
                        {{detailData.uModMax}}V
                    </el-form-item>
                    <el-form-item label="光伏模块效率（STC）" prop="etaMod">
                        {{detailData.etaMod}}%
                    </el-form-item>
                    <el-form-item label="接地建议" prop="isGeneratorGroundRequired">
                        <template v-for="item in groundList">
                            <span v-if="item.value==detailData.isGeneratorGroundRequired" :key="item.value">{{item.name}}</span>
                        </template>
                    </el-form-item>
                    <el-divider content-position="center">机械性能</el-divider>
                    <el-form-item label="光伏模块中的电池数" prop="cellsCount">
                        {{detailData.cellsCount}}
                    </el-form-item>
                    <el-form-item label="重量" prop="moduleWeight">
                        {{detailData.moduleWeight}}Kg
                    </el-form-item>
                    <el-form-item label="长度" prop="moduleLength">
                        {{detailData.moduleLength}}mm
                    </el-form-item>
                    <el-form-item label="宽度" prop="moduleWidth">
                        {{detailData.moduleWidth}}mm
                    </el-form-item>
                </el-col>
                <el-col :span="10" :offset="2">
                    <el-form-item label="晶片工艺" prop="materialID">
                        <template v-for="(item) in materialList">
                            <span v-if="item.id==detailData.materialID" :key="item.id">{{item.name}}</span>
                        </template>
                    </el-form-item>
                    <el-divider content-position="center">温度系数</el-divider>
                    <el-form-item label="" prop="tempModUMPPrel" class="th">
                        <span class="span-width">%/°C</span>
                        <span>mV/°C</span>
                    </el-form-item>
                    <el-form-item label="MPP-电压" prop="tempModUMPPrel">
                        <span class="span-width">{{detailData.tempModUMPPrel}}</span>
                        <span>{{detailData.tempModIMPP}}</span>
                    </el-form-item>
                    <el-form-item label="开路电压" prop="tempModU0rel">
                        <span class="span-width">{{detailData.tempModU0rel}}</span>
                        <span>{{detailData.tempModU0}}</span>
                    </el-form-item>
                    <el-form-item label="" prop="tempModUMPPrel" class="th">
                        <span class="span-width">%/°C</span>
                        <span>mA/°C</span>
                    </el-form-item>
                    <el-form-item label="短路电流" prop="tempModISCrel">
                        <span class="span-width">{{detailData.tempModISCrel}}</span>
                        <span>{{detailData.tempModISC}}</span>
                    </el-form-item>
                    <el-divider content-position="center">因老化而退化</el-divider>
                    <el-form-item label="开路电压允许偏差">
                        {{detailData.toleranceModU0}}%
                    </el-form-item>
                    <el-form-item label="MPP电压允许偏差">
                        {{detailData.toleranceModUMPP}}%
                    </el-form-item>
                    <el-form-item label="MPP电流允许偏差">
                        {{detailData.toleranceModIMPP}}%
                    </el-form-item>
                    <el-form-item label="短路电流允许偏差">
                        {{detailData.toleranceModISC}}%
                    </el-form-item>
                    <el-divider content-position="center">注释</el-divider>
                    <el-form-item label="注释" prop="comment">
                        {{detailData.comment}}
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
        </div>
        </el-dialog>
    </div>
</template>

<script>
export default {
    components: {

    },
    props: {
        detailData:{}
    },
    data() {
        return {
            manufacturerList:[],
            materialList:[],
            groundList:[{name:"不接地",value:"2"},{name:"正极接地",value:"1"},{name:"负极接地",value:"-1"}]
        };
    },
    computed: {
        visibleShow(){
            return this.$store.state.sysStore.visibleShow
        }
    },
    watch: {
        detailData:{
            handler(nv,ov){
                console.log(nv)
                if(nv){
                    for(let key in nv){
                        this.detailData[key]=nv[key]||'-'
                    }

                }
            }
        }
    },
    created() {

    },
    mounted() {
        this.systemTManufacturerGetList()
        this.systemTMaterialGetList()
    },
    methods: {
        handleClose(){
            this.$store.commit('setVisibleShow',false)
        },
        /*获取供应商*/
        async systemTManufacturerGetList(){
            let res = await this.API.systemTManufacturerGetList()
            this.manufacturerList = res
        },

        /*获取晶片工艺*/
        async systemTMaterialGetList(){
            let res = await this.API.systemTMaterialGetList()
            this.materialList = res;
        }
    },
};
</script>

<style lang="less">
.moduleDetail-main-box{
    .modal-box-flex{
    display: flex;
    justify-content: space-between;
    padding: 5px;
        div:nth-child(1){
        flex: 2
        }
        div:nth-child(2){
        flex: 1
        }
    }
    .el-dialog .el-form-item {
        margin-bottom: 0;
        margin-right: 0;
    }
    .span-width{
        display: inline-block;
        width:180px;
    }
    .el-form-item__content span{
        width: 100px;
    }
    .th{
        span{
            font-weight: bold;
            line-height: 15px;
            font-size: 12px;
        }
    }    
}
</style>
